<template>
  <div>
    <el-card class="box-card">

      <el-row :gutter="20">

        <el-col :span="6">
          <el-button size="small" style="float: left" @click="buyGoods()">采购</el-button>
        </el-col>

        <el-col :span="6">
          <el-form :model="goodsForm" label-width="80px">
            <el-form-item label="商品名称">
              <el-input v-model="goodsForm.gname"></el-input>
            </el-form-item>
          </el-form>
        </el-col>
        <el-button size="small" @click="searchList">查询</el-button>
      </el-row>



      <el-dialog title="商品采购" :visible.sync="buyFormVisible">
        <el-form>
          <el-form-item label="采购商品">
            <el-select v-model="goodsForm.gid" placeholder="请选择">
              <el-option
                v-for="item in goodsList"
                :key="item.id"
                :label="item.gname"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="采购数量">
            <el-input v-model="goodsForm.num" v-on:blur="checkNum(goodsForm.num)"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="buyFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="saveGoods()">确 定</el-button>
        </div>
      </el-dialog>

      <el-table
        :data="orderList"
        style="width: 100%">
        <el-table-column
          type="index"
          width="180">
        </el-table-column>
        <el-table-column
          prop="oid"
          label="单据编号"
          width="180">
        </el-table-column>
        <el-table-column
          prop="gname"
          label="商品信息"
          width="180">
        </el-table-column>
        <el-table-column
          label="单据日期">
          <template slot-scope="scope">
            {{scope.row.time | datefmt('YYYY-MM-DD HH-mm-ss')}}
          </template>
        </el-table-column>
        <el-table-column
          prop="cgman"
          label="操作员">
        </el-table-column>
        <el-table-column
          label="状态">
          <template slot-scope="scope">
            {{scope.row.status | statusFit}}
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="shenhe(scope.row.id)" v-if="scope.row.status==0">审核</el-button>
          </template>
        </el-table-column>
      </el-table>
{{user0}}
    </el-card>
  </div>
</template>

<script>
    export default {
        name: "UserList",
        data(){
            return{
                buyFormVisible : false,
                goodsList:[],
                goodsForm:{},
                orderList:[],
                user0:{}
            }
        },
        methods:{
            buyGoods:function () {
                this.$http.get("/goods/list").then(
                    (res)=>{
                        this.goodsList=res.data.result;
                        this.buyFormVisible=true;
                    }
                )
            },
            saveGoods:function () {
                this.goodsForm.shopid=this.user0.uid
                this.$http.post("/order/save",this.goodsForm).then(
                    (res)=>{
                        this.buyFormVisible=false;
                    }
                )
            },
            searchList:function () {
                this.$http.post("/order/list",this.goodsForm).then(
                    (res)=>{
                        this.orderList=res.data.result;
                        this.searchList();
                    }
                )
            },
            checkNum:function (val) {
                if(val<0){
                    alert("数量必须大于0");
                }else {
                    this.goodsForm.num=val;
                }
            },
            shenhe:function (id) {
                this.$http.post("/order/shenhe/"+id).then(
                    (res)=>{
                        this.searchList();
                    }
                )
            }
        },
        filters:{
            statusFit:function (val) {
                if(val=='0'){
                    return "未审核";
                }
                if(val=='1'){
                    return "已转采购";
                }
            }
        },
        mounted() {
            this.searchList();
            this.user0=JSON.parse(sessionStorage.getItem("user"));
        }
    }
</script>

<style scoped>

</style>
